<!DOCTYPE html>
<html lang="zh">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>百度一下，你就知道</title>
    <link rel="stylesheet" href="reset.css">
    <link rel="stylesheet" href="style.css">
    <link rel="icon" href="favicon.ico">
    <link rel="stylesheet" href="importfont.css">
</head>
<body>
    <div id="top-bar" class="clearfix">
        <!-- 左边的头条框信息 -->
        <div class="left-top fl">
            <a href="#">新闻</a>
            <a href="#">hao123</a>
            <a href="#">地图</a>
            <a href="#">视频</a>
            <a href="#">贴吧</a>
            <a href="#">学术</a>
            <a href="#">更多</a>
        </div>

        <!-- 右边的头条框内容 -->
        <div class="right-top fr">
            <a href="#">抗击肺炎</a>
            <span class="setting">设置</span>
            <button>登录</button>
            <!-- 这里“设置”有一个弹出块 -->
            <div class="set-block shadow">
                <div>搜索设置</div>
                <div>高级搜索</div>
                <div>关闭预测</div>
                <div>隐私设置</div>
                <div>关闭热榜</div>
            </div>
        </div>
    </div>
    

    <!-- 中间的近期热点图 -->
    <div class="hot">
        <a href="#" title="点击一下，了解更多">
            <img src="https://www.baidu.com/img/PCtm_d9c8750bed0b3c7d089fa7d55720d6cf.png" 
            alt="近期焦点">
        </a>
    </div>

    <!-- 搜索框 -->
    <form id="search" class="clearfix">
        <span class="camera iconfont">&#xe628;</span>
        <input class="search-border fl search-grey" type="text" autofocus="autofocus">
        <input class="search-button fr" type="submit" value="百度一下">
    </form>
    
    <!-- 百度热榜 -->
    <div id="hot-bar">
        <a class="hot fl" href="#">百度热榜</a>
        <span class="change fr iconfont">&#xe61c;换一换</span>
    </div>
    
    <!-- 热榜新闻 -->
    <div id="news" class="clearfix">

        <!-- 左版新闻 -->
        <div class="news-left fl"> 
            <a href="#">
                <i class="fir">1</i>
                <span>美媒称特朗普曾躲进地堡一小时</span>
                <img src="https://dss0.bdstatic.com/5aV1bjqh_Q23odCf/static/superman/img/hot_search/mark-icon-4@1x-000c9ed385.png" 
                class="hit">
            </a>
            <a href="#">
                <i class="sec">2</i>
                <span>造谣体罚学生致吐血家长被刑拘</span>
            </a>
            <a href="#">
                <i class="thi">3</i>
                <span>纽约市长女儿参加抗议活动被捕</span>
            </a>
        </div>
        
        <!-- 右版新闻 -->
        <div class="news-right fr">
            <a href="#" class="fr">
                <i>4</i>
                <span>张文宏:秋冬肯定有第二波疫情</span>
                <img src="https://dss0.bdstatic.com/5aV1bjqh_Q23odCf/static/superman/img/hot_search/mark-icon-3@1x-fdb050afea.png">
            </a>
            <a href="#" class="fr">
                <i>5</i>
                <span>微云台超防抖 vivo X50系列首发</span>
                <img src="https://dss0.bdstatic.com/5aV1bjqh_Q23odCf/static/superman/img/hot_search/mark-icon-2@1x-b8301bfcf8.png">
            </a>
            <a href="#" class="fr">
                <i>6</i>
                <span>这座城市新冠死亡率高达70％</span>
            </a>
        </div>
        
    </div>

    <!-- 小球样子的二维码 -->
    <div id="twodim-code" class="iconfont">
        <div class="iconfont">&#xe615;</div>
        <!-- 这里有一个弹出块 -->
        <div class="extra-block shadow">
                <span class="scan-log iconfont fl">&#xe600;百度APP扫码登录</span>
                <span class="descrip fl">有事搜一搜 没事看一看</span>
                <img class="fr" src="https://passport.baidu.com/v2/api/qrcode?sign=9a90932b5b328a611734305b500b6791&lp=pc&qrloginfrom=pc">
        </div>
    </div>

    <!-- 最下面的说明栏 -->
    <div id="bottom-bar">
        <div class="bar-left fl">
            <a href="#">设为首页</a>
            <a href="#">关于百度</a>
            <a href="#">About Baidu</a>
            <a href="#">百度营销</a>
            <a href="#">使用百度前必读</a>
            <a href="#">意见反馈</a>
            <a href="#">帮助中心</a>
        </div>
        <div class="bar-right fr">
            <span>©2020 Baidu</span>
            <span>(京)-经营性-2017-0020</span>
            <a href="#">京公网安备11000002000001号</a>
            <span>京ICP证030173号</span>
        </div>
    </div>

    <!-- 此处插入JS文件 -->
    <script src="focus.js"></script>

</body>
</html>